<template>
	<view  class="testNavBar">
		<u-navbar
			title-color="#fff"
			back-icon-color="#ffffff"
			:is-fixed="isFixed"
			:is-back="isBack"
			:background="background"
			:back-text-style="{ color: '#fff' }"
			:title="title"
			:back-icon-name="backIconName"
			:back-text="backText"
		>
			<view class="navbar-right" slot="right">
				<view class="message-box right-item">
					<u-icon name="chat" size="38"></u-icon>
					<u-badge count="18" size="mini" :offset="[-15, -15]"></u-badge>
				</view>
				<view class="dot-box right-item">
					<u-icon name="calendar-fill" size="38"></u-icon>
					<u-badge size="mini" :is-dot="true" :offset="[-6, -6]"></u-badge>
				</view>
			</view>
		</u-navbar>
	</view>
</template>

<script>
export default {
	data() {
		return {
			isFixed: true,
			isBack: true,
			title: '代办事项',
			backText: '返回',
			backIconName: 'nav-back',
			background: {
				'background-image': 'linear-gradient(45deg, rgb(28, 187, 180), rgb(141, 198, 63))'
			}
		};
	},
	onShow() {
		// uni.setNavigationBarTitle({
		// 	title: this.$t('代办事项')
		// });
	},
	methods: {}
};
</script>

<style lang="scss" scoped>
.navbar-right {
	margin-right: 24rpx;
	display: flex;
}

.search-wrap {
	margin: 0 20rpx;
	flex: 1;
}

.right-item {
	margin: 0 12rpx;
	position: relative;
	color: #ffffff;
	display: flex;
}
</style>
